<template>
  <div>
    <van-form>
      <van-field v-model="form.name" type="text" label="收货人" placeholder="收货人" />
      <van-field
        v-model="form.mobile"
        type="text"
        label="手机号码"
        placeholder="手机号码"
      />
      <van-field
        readonly
        clickable
        name="area"
        v-model="form.address"
        label="地区选择"
        placeholder="点击选择省市区"
        @click="showArea = true"
      />
      <van-popup v-model="showArea" position="bottom">
        <van-area
          :area-list="areaList"
          @confirm="onConfirm"
          @cancel="showArea = false"
        />
      </van-popup>
      <van-field
        v-model="form.address_detail"
        type="text"
        label="详细地址"
        placeholder="详细地址"
      />
      <van-field name="switch" label="设为默认地址">
        <template #input>
          <van-switch v-model="form.is_default" size="20" />
        </template>
      </van-field>
    </van-form>
    <div>
      <button @click="sumbit">保存</button>
    </div>
  </div>
</template>

<script>
import { saveAction } from "@/axios/index";
import { areaList } from '@vant/area-data';
export default {
  name: "editAddress",

  data() {
    return {
      form: {
       
      },
      showArea: false,
      areaList,
    };
  },
  created() {
    if(this.$route.params){

        this.form = this.$route.params.data;
        // console.log(this.form);
    }
  },
  mounted() {},

  methods: {
    onConfirm(values) {
      this.form.address = values
        .filter((item) => !!item)
        .map((item) => item.name)
        .join('/');
      this.showArea = false;
    },
    sumbit(){
        console.log(this.form);
        var arr = this.form.address.split("/");
        this.form.address=arr.join(" ")
        var obj={
                addressId:"",
                checked:this.form.is_default,
                address:this.form.address,
                detailadress:this.form.address_detail,
                openId:localStorage.getItem("openId"),
                telNumber:this.form.mobile,
                userName:this.form.name
        };
        if(this.form.id){ 
            obj.addressId=this.form.id        
        }
        saveAction(obj)
        // 提交后返回
        this.$router.back()
    }
  },
};
</script>

<style scoped>
</style>